<template>
  <div class="news_details">
    <h5>新闻详情</h5>
    <h4>{{ details.title }}</h4>
    <p>{{ details.content }}</p>
  </div>
</template>

<script>
export default {
  validate({ params }) {
    // 必须是number类型
    return params.id && /^\d+$/.test(params.id)
  },
  async asyncData(context) {
    const { params, $api } = context

    const { code, data } = await $api.getNewsDetails({ id: params.id })

    let details = {}

    if(code === 200) {
      console.log(data)
      details = data
    }

    return {
      details
    }
  },
  mounted() {

  }
}
</script>

<style lang="scss" scoped>
.news_details {
  padding: 0 40px;

  h4 {
    text-align: center;
    margin: 10px 0 20px;
  }
}
</style>
